<!--最热商品-->
<div class="add-products" id="thisHot">
    <h3 class="w3ls-title">热卖商品</h3>
    <div class="container">
        <div class="add-products-row">
            <div class=" w3ls-add-grids" v-for="goods in hotGoodsList" @click="toDetail(goods.id)">
                <a href="javascript:;">
                    <img :src="goods.goodsPic">
                    <p>{{goods.goodTitle}}<span>${{goods.goodPrice}}</span></p>
                    <span>Shop now <i class="fa fa-arrow-circle-right" aria-hidden="true"></i></span>
                </a>
            </div>
        </div>
    </div>
</div>

<script>
    new Vue({
        el: "#thisHot",
        data: {
            hotGoodsList: []
        },
        methods: {
            findHotGoods: function () {
                axios({
                    url: "/home/findHotGoods"
                }).then(res => {
                    if (res.data.flag) {
                        this.hotGoodsList = res.data.data;
                    }
                });
            },
            toDetail: function (goodsId) {
                sessionStorage.setItem("goodsId",goodsId);
                location.href = "goodsDetail.html"
            }
        },
        created: function () {
            this.findHotGoods();
        }
    })
</script>